<template>
    <div>
        <div class="width-75 tc bb-1-e">
            <div class="z-header">
                <div @click="$router.back(-1)" class="lt">
                    <i class="iconfont icon-zuo m-t-18 fs-32"></i>
                </div>
                <div class="fs-32 c-3">
                    新增收货地址
                </div>
            </div>
        </div>
        <nav>
            <ul>
                <li>
                    <div class="index-blank"></div>
                </li>
                <li class="z-header bb-1-e">
                    <div class="width-75">
                        <span>联系人:</span>
                        <input type="text" placeholder="请填写收货人的姓名" class="m-l-5 b-0" v-model="contacts">
                    </div>         
                </li>
                <li class="z-header bb-1-e">
                    <div class="width-75">
                        <span>手机号:</span>
                        <input type="text" placeholder="请填写收货手机号码" class="m-l-5 b-0" v-model="phone">
                    </div>
                </li>
                <li class="z-header bb-1-e">
                    <div class="width-75">
                        <span>收货地址:</span>
                        <span class="m-l-5" @click="Site()">{{foundSite}}  点击选择</span>
                    </div>
                </li>
                <li class="z-header bb-1-e">
                    <div class="width-75">
                        <span>详细地址:</span>
                        <input type="text" placeholder="例：8号楼0812室" class="m-l-5 b-0" v-model="detail">
                        <!--<span class="m-l-5"></span>-->
                    </div>
                </li>
                <li>
                    <div class="width-75">
                        <button class="w p-tb-18 b-c2 c-f fs-32 m-t-28" @click="confirm()">保存地址</button>
                    </div>
                </li>
                <li v-if="this.$route.query.siteId != undefined">
                    <div class="tc m-t-4 c-f3">
                        <span @click="deleteSite()">
                            删除地址
                        </span>
                        
                    </div>
                </li>  
            </ul>
        </nav>
        <site v-if="isSite" v-on:site="toshow">
        </site>    

    </div>
</template>
<script>
import { z } from '../../assets/js/common'
    export default {
        data(){
            return {
                isSite:false,
                foundSite:"",    //创建地址
                contacts:"",   //联系人
                phone:"",     //手机号
                detail:"",     //详细地址   undefined  this.$route.query.siteId
            }
        },
        methods:{
            Site(){
                this.isSite = true;
            },
            toshow(site){
                this.foundSite = site;
                this.isSite = false;
                console.log(this.foundSite);
            },
            // 调用发布接口
            confirm(){
                 var params = new URLSearchParams();
                 params.append("receivingName", this.contacts);
                 params.append("receivingPhone", this.phone);
                 params.append("receivingRemarks", this.foundSite);
                 params.append("receiving", this.detail);

                if(this.$route.query.siteId != undefined){
                      params.append("receivingAddressId", this.$route.query.siteId);
                }
                this.$http({
                    method:"post",
                    url: localPath + "/goods/addReceivingAddress",
                    data: params
                }).then((data)=>{
                    console.log(data);
                    // console.log(this.$route.query.id);
                }).catch((error)=>{
                    console.log(error);
                })
            },
            // 删除地址
            deleteSite(){
                var params = new URLSearchParams();
                params.append("receivingAddressId", this.$route.query.siteId);
                this.$http({
                    method:"post",
                    url: localPath + "/goods/deleteByIdReceivingAddress",
                    data: params
                }).then((data)=>{
                    console.log(data);
                }).catch((error)=>{
                    consle.log(error);
                })
            }
        },
        mounted() {
            document.addEventListener(z());
        },
    }
</script>
<style>
  
</style>
